<!--
 * @Description: 表格列表
 * @Author: zhaoxiaoyang & seadon
 * @LastEditors: seadon
 * @Date: 2021-07-16 16:57:33
 * @LastEditTime: 2022-09-22 18:15:55
-->
<template>
	<div class="card-title" @click="handleToggleTitle">
		<i
			class="low-code card-title-icon"
			:class="isOpen ? 'iconpackup' : 'iconjiantou-shouqi'"
		></i>
		<ellipsis-tooltip :title="group.name" />
	</div>
	<a-table
		v-show="isOpen"
		class="list-table"
		:data-source="data"
		:columns="columns"
		:pagination="false"
		:custom-row="Rowclick"
		row-key="fb_key"
		:scroll="{ y: true }"
	>
		<template #custom-contact="{ record }">
			<div v-if="record?.user_bo" class="custom-person">
				<ok-person-cell
					width="22px"
					height="22px"
					.person-info="record.user_bo"
				></ok-person-cell>
				<div class="custom-person-name">
					{{ record.user_bo?.employee_name }}
				</div>
			</div>
		</template>
		<template #operation="{ record }">
			<div class="custom-operation">
				<i
					v-if="record.collected"
					class="low-code iconshoucang"
					@click.stop="collectionEvents(record)"
				></i>
				<i
					v-else
					class="low-code icondaishoucang"
					@click.stop="collectionEvents(record)"
				></i>
			</div>
		</template>
	</a-table>
	<div
		v-show="group.total > data.length && isOpen"
		class="table-all"
		@click="handleClickAll(group.groupId)"
	>
		<all-loading v-if="allLoading" />
		<img v-else src="@/assets/images/all.svg" />
		<span class="table-all-text">
			{{ $t('pages.home.loadAll', '加载全部') }}
		</span>
	</div>
</template>
<script setup lang="ts">
import { ref, unref } from 'vue'
import EllipsisTooltip from '@/entry_desktop/components/EllipsisTooltip'
import { useHomeContext } from '@/entry_desktop/views/Home/hooks/useContext'
// import { BaseTable as PokBaseTable } from '@/entry_desktop/components/BaseTable'
import columns from '../../constant/applicationColumns.tsx'
import type { IApplicationList } from '../../type'
import AllLoading from '../AllLoading.vue'

import '../../index.less'

const props = defineProps<{
	data: IApplicationList[]
	group: Record<string, any>
	allLoading: boolean
}>()
const emits = defineEmits(['onCollectionEvents', 'onSaveRecent', 'onGetAll'])

const { homeEmitter } = useHomeContext()

const isOpen = ref(true)
const changeHandler = () => {
	isOpen.value = !unref(isOpen)
}
const collectionEvents = (item: any) => {
	emits(
		'onCollectionEvents',
		item.collected ? '0' : '1',
		item.fb_key,
		item.group_id,
		item
	)
}

const Rowclick = (record: any, index: number) => {
	return {
		onClick: () => {
			emits('onSaveRecent', record)
		},
	}
}
const handleToggleTitle = () => {
	isOpen.value = !unref(isOpen)
}
const handleClickAll = (groupId: string) => {
	emits('onGetAll', groupId)
}
// onMounted(() => {
// 	emit('hideLoading')
// })
</script>
